<div class='title'>安装使用</div>
<div class='text'>
    <div>考虑到不同的需求，cnchar 的功能被拆分到以下四个库中，以及一个汇集所有功能的总库：</div>
    <div>
        <table>
            <tr>
                <th>名称</th>
                <th>描述</th>
                <th>功能</th>
            </tr>
            <tr>
                <td>cnchar</td>
                <td>主js库，其他三个库依赖于这个库</td>
                <td>含有简体字拼音、多音字、音调、笔画数等功能</td>
            </tr>
            <tr>
                <td>cnchar-poly</td>
                <td>多音词库</td>
                <td>含有识别多音词功能</td>
            </tr>
            <tr>
                <td>cnchar-order</td>
                <td>笔画顺序库</td>
                <td>含有识别笔画顺序、笔画名称、笔画形状等功能</td>
            </tr>
            <tr>
                <td>cnchar-trad</td>
                <td>繁体字库</td>
                <td>支持繁体、火星、简体互转，支持繁体拼音笔画多音字全功能</td>
            </tr>
            <tr>
                <td>cnchar-all</td>
                <td>汇总库</td>
                <td>包含以上四个库的所有功能</td>
            </tr>
      </table>
    </div>
</div>
<div class='title' jump-des='script'>1.npm 安装</div>
<div class='sub'>
    <div class="text">
        安装基础库 cnchar：
    </div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
npm i cnchar
    </div>
    <div class="text">
        安装插件：
    </div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
npm i cnchar-poly cnchar-order cnchar-trad
    </div>
    <div class='text'>当然您也可以按需安装其中的几个，但是 <span class="red">cnchar</span> 这个基础库是必须安装的</div>
    <div class='text'>或者您可以通过安装<span class="red">cnchar-all</span>来使用完整功能，这个库引用了上面的四个库</div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
npm i cnchar-all
    </div>
    <div class='text'>在浏览器环境中使用：</div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
// 请保证最先引入 cnchar 基础库，其他几个库顺序无所谓
import cnchar from 'cnchar';
import 'cnchar-poly';
import 'cnchar-order';
import 'cnchar-trad';

console.log('汉字'.spell()); // prototype 方式调用
console.log(cnchar.spell('汉字')); // cnchar api 调用
    </div>
    <div class='text'>在非浏览器环境中（nodejs）使用需要显示调用 <span class="red">cnchar.use</span> 方法使用插件，其他使用方式与浏览器环境一致：</div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
// 请保证最先引入 cnchar 基础库，其他几个库顺序无所谓
var cnchar = require('cnchar');
var poly = require('cnchar-poly');
var order = require('cnchar-order');
var trad = require('cnchar-trad');
cnchar.use(poly, order, trad);

console.log('汉字'.spell()); // prototype 方式调用
console.log(cnchar.spell('汉字')); // cnchar api 调用
    </div>
</div>
<div class='title' jump-des='cli'>2.script 标签引入</div>
<div class='sub'>
    <div class='text'> 
        您可以通过 script 标签方式引入使用 cnchar
    </div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.latest.min.js">&lt;/script>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.poly.latest.min.js">&lt;/script>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.order.latest.min.js">&lt;/script>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.trad.latest.min.js">&lt;/script>
    </div>
    <div class='text'> 
        以上方式是引用cnchar的最新版本，如果你想使用指定版本，可以加入版本号：
    </div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.{version}.min.js">&lt;/script>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.poly.{version}.min.js">&lt;/script>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.order.{version}.min.js">&lt;/script>
&lt;script src="https://www.theajack.com/cnchar/dist/cnchar.trad.{version}.min.js">&lt;/script>
    </div>
    <div class='text'> 
        这种引入方式会在 window 对象上定义 cnchar 对象，可以直接使用：
    </div>
    <div class='j-code not-test' disabled width='99%' height='auto'>
&lt;script>
    console.log('汉字'.spell()); // prototype 方式调用
    console.log(cnchar.spell('汉字')); // cnchar api 调用
&lt;/script>
    </div>
</div>

<script>
    new Jet()
</script>